<template>
	<view class="waterfall_list" v-for="(item,index) in listData" :key="index">
		<image class="waterfall_list_img" :src="item.goods_main_pic" mode="widthFix" @load="onImageFun"></image>
		<view class="msg_box">
			<view class="name single-omit">商品{{index}}</view>
			<view class="price-box flex-align-center">
				<view class="unit"><text>￥</text>{{index*10}}</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		props:{
			listData:{
				// type:Array,
				require:true,
			},
			onImageFun:{
				type:Function,
				require:true,
			}
		},
		data(){
			return{
				
			}
		},
		mounted(){
			console.log(this.listData)
		}
	}
</script>

<style scoped lang="scss">
	.waterfall_list{
		width:340rpx;
		background:#fff;
		border: 1px solid rgb(238, 238, 238);
		box-shadow: 0px 1px 8px 1px rgba(166, 166, 166, 0.2 );
		margin-top:8px;
		.waterfall_list_img{
			width:100%;
			// max-height:400rpx;
		}
	}
</style>